var JHData;
var WCData;
var zongData;
var DataDiff = [];
var DataDiff1 = [];
var JHData1;
var WCData1;
var zongData1;
var indexMyChartOption = 1;
var ifDiffFlg = false;
var legend = [{
            itemWidth:12,
            itemHeight:12,
            top:0, //调整位置
            left:'35%' ,//调整位置
            textStyle: {color: '#fff',fontSize:'16'},
            data:[{name:'计划(万元)',icon:'roundRect'}],   //rect为矩形
        },{
            itemWidth:12,
            itemHeight:12,
            top:5, //调整位置
            right:'35%' ,//调整位置
            textStyle: {color: '#fff',fontSize:'16'},
            data:[{name:'完成(万元)',icon:'roundRect'}],   //rect为矩形
        }];
var  discernX = "";		


function getData(discern) {
    var data;
    var proId = window.localStorage.getItem("proId");
    var NYR = window.parent.document.getElementById("NYR").value;
    //2020-11
    var NYRArr = NYR.split("-");
    if (discern == null){
        data = setData(proId,NYRArr);
    }else {
        data = setData(proId,NYRArr,discern);
    }
    return data;
}

function setData(proId,NYRArr,discern) {
    var data;
    if (discern != null) {
        data = {
            "proId":"4500000707",
            "year":NYRArr[0],
            "month":NYRArr[1],
            "discern":discern
        };
    }else {
        data = {
            "proId":"4500000707",
            "year":NYRArr[0],
            "month":NYRArr[1]
        };
    }
    return data;
}


function httpRequestReload($JQuery,dataParam,url) {
    var dataSource;
    $JQuery.ajax({
        url: getIP() + '/prodetail/'+url,
        async:false,
        type: 'post',
        contentType:'application/json',
        dataType:"json",
        data:JSON.stringify(dataParam),
        success: function (data) {
            if (data.code == "succee") {
			    dataSource = data.data;  
            }
        }
    });
    return dataSource;

}


function queryInvDeviation($JQuery) {
    var proId = window.localStorage.getItem("proId");
    var dataParam = {"proId":proId};
    var dataSource;
    $JQuery.ajax({
        url: getIP() + '/imgProgress/queryCapDeviationByProid',
        async:false,
        type: 'post',
        contentType:'application/json',
        dataType:"json",
        data:JSON.stringify(dataParam),
        success: function (data) {
            if (data.code == "succee") {
              
                dataSource = data.data[0];
            }
        }
    });
    return dataSource;
}

function setInvDeviationDom($JQuery,dataSource) {
    if(dataSource != null){
        //偏差
        var deviation = dataSource.deviation;
        //措施
        var measures = dataSource.remark;
        var strPCSM = '';
        var strGJCS = '';
        for (let i = 0;i < deviation.length; i++){
            strPCSM.append(deviation[i]+'<br>');
        }
        for (let i = 0;i < measures.length; i++){
            strGJCS.append(measures[i]+'<br>')
        }
        
        $JQuery(".PCSM").html(strPCSM);
        $JQuery(".GJCS").html(strGJCS);
    }
}

function reloadMyChartDom($JQuery,dataSource) {
    //总体 ratio
	if(dataSource == undefined){
		var  dataSource = {
			addupRatio:0,
			annualInvestAc:0,
			monthInvestAc:0,
			addupInvestAc:0,
			yearInvestPlan:0,
			monthRatio:0,
			yearInvestAc:0,
			annualInvestPlan:0,
			yearRatio:0,
			annualRatio:0,
			monthInvestPlan:0,
			addupInvestPlan:0
		}
	}	
		var addupRatio = Number(dataSource.addupRatio).toFixed(0),
		    //全年 实际
		    annualAc = dataSource.annualInvestAc,
		    //当月 实际
		    monthAc = dataSource.monthInvestAc,
		    //总体 实际
		    addupAc = dataSource.addupInvestAc,
		    //今年 计划
		    yearInvestPlan = dataSource.yearInvestPlan ,
		    //当月 ratio
		    monthRatio = dataSource.monthRatio,
		    //今年 实际
		    yearInvestAc = dataSource.yearInvestAc,
		    //全年 计划
		    annualPlan = dataSource.annualInvestPlan,
		    //今年 ratio
		    yearRatio = dataSource.yearRatio,
		    //全年 ratio
		    annualRatio = dataSource.annualRatio,
		    //当月 计划
		    monthPlan =  dataSource.monthInvestPlan,
		    //总体  计划
		    addupPlan = dataSource.addupInvestPlan;
	
    

    if (monthRatio == null) {
        monthRatio = 0;
    }
    if(monthAc == null){
        monthAc = 0;
    }
    if(monthPlan == null){
        monthPlan = 0;
    }
    $JQuery(".mothRatio").html(monthRatio+"%");
    $JQuery(".sofarRatio").html(yearRatio+"%");
    $JQuery(".annualRatio").html(annualRatio+"%");
    $JQuery(".addupAc").html(ji_suan(addupAc));
    $JQuery(".addupRatio").html('<span class="wcl_spBox">'+addupRatio+'</span>%');
    JHData = [{value:ex_jiSuan(monthPlan),discern:'month'},{value:ex_jiSuan(yearInvestPlan),discern:'accu'},{value:ex_jiSuan(annualPlan),discern:'annual'}];
    WCData = [{value:ex_jiSuan(monthAc),discern:'month'},{value:ex_jiSuan(yearInvestAc),discern:'accu'},{value:ex_jiSuan(annualAc),discern:'annual'}];
    zongData = ['当月', '逐月累计', '全年'];
    option = setOption(JHData,WCData,zongData,legend);
    myChart = initMyChartDom(document.getElementById('myEchart'),option);
    myChartMouseClick(myChart,$JQuery);
  
}

  function  ji_suan(num){
		 var value = 0;
		 if(num != null){
			 if(num>= 100000000){
				 console.log(num)
				   value = Number(parseFloat(num)/100000000).toFixed(0);
				     return   "<span  style='font-size:1.4rem;'>"+value+"</span>亿";
			 }else{
				  value = Number(parseFloat(num)).toFixed(0);
				  return   "<span  style='font-size:1.4rem;'>"+value+"</span>万";
			 }
			
		 }
		
	   }
	   

  function  ex_jiSuan(num){
		 var value = 0;
		 if(num != null){
			 value = Number(parseFloat(num)).toFixed(0);
		 }
		return   value;
   }	   
	   
	   
	   



function myChartMouseClick(myChart,$JQuery) {
    myChart.on('click', function (params) {
		if(params.data.discern == undefined){
			window.parent.parent.location.href = "https://vhcals4hci.shmetro.com:44300/sap/bc/ui2/flp?sap-client=100&sap-language=ZH#PurchaseOrder-change?sap-ui-tech-hint=GUI&uitype=advancedNoPar";
		}
	    console.log(params)
		
        $JQuery(".fhBoxBtn").show();
        if(ifDiffFlg == false){
            if(JHData1!=null&&WCData1!=null){
                indexMyChartOption++;
                var option = setOption(JHData1,WCData1,zongData1,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }else{
                var discern = params.data.discern;
                if (discern == null) {
                    return;
                }
                indexMyChartOption++;
                var data = getData(discern);
			    data.proId = "4500000707";
                var dataSource = httpRequestReload($JQuery,data,"proInvestDown");
				document.getElementById("zlBoxDiv").style="display:block";
				console.log(dataSource)
				var  JHData1 = [],WCData1 =[],zongData1=[];
				for(var i=0;i<dataSource.length;i++){
					// var conid = dataSource[i].conid;
					// var conname = dataSource[i].conname;
					// var investAc = dataSource[i].investAc;
					// var investPlan = dataSource[i].investPlan;
					
					JHData1.push(ex_jiSuan(dataSource[i].investPlan));
					WCData1.push(ex_jiSuan(dataSource[i].investAc));
					zongData1.push(dataSource[i].conname);
					
				}
				
                // JHData1 = [investPlan];
                // WCData1 = [investAc];
                // zongData1 = [conname];

               
                var option = setOption(JHData1,WCData1,zongData1,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }
        }else if(ifDiffFlg == true){
            if(DataDiff1!=null&&DataDiff1.length!=0){
                indexMyChartOption++;
                var option = setOption(DataDiff1,null,zongData1,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }else{
               var  discern = params.data.discern;
			   localStorage.setItem("discernX",discern);
			  
                if (discern == null) {
                    return;
                }
                indexMyChartOption++;
                var data = getData(discern);
                var dataSource = httpRequestReload($JQuery,data,"proInvestDown");
                var conname = dataSource.conname;
                var investAc = dataSource.investAc;
                var investPlan = dataSource.investPlan;
                DataDiff1[0] = investAc-investPlan;
                zongData1 = [conname];
                var option = setOption(DataDiff1,null,zongData1,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }
        }
    });
}



function backBtn($JQuery){
    $JQuery(".fhBoxBtn").on("click",function(){
        indexMyChartOption = 1;
        $JQuery(".fhBoxBtn").hide();
		 $JQuery("#zlBoxDiv").hide();
        if(ifDiffFlg == false){
            var option = setOption(JHData,WCData,zongData,legend);
            var myChart = initMyChartDom(document.getElementById('myEchart'),option);
        }else {
            if(DataDiff == null || DataDiff.length == 0){
                var data = getData();
                var dataSource = httpRequestReload($JQuery,data,"proInvest");
                var  annualAc = dataSource.annualInvestAc,//全年 实际
                    //当月 实际
                    monthAc = dataSource.monthInvestAC,
                    //逐月 计划
                    yearInvestPlan = dataSource.yearInvestPlan,
                    //全年 计划
                    annualPlan = dataSource.annualInvestPlan,
                    //逐月 实际
                    yearInvestAc = dataSource.yearInvestAc,
                    //当月 计划
                    monthPlan = dataSource.monthInvestPlan;
                DataDiff = [{value:monthAc-monthPlan,discern:'month'},{value:yearInvestAc-yearInvestPlan,discern:'accu'},{value:annualAc-annualPlan,discern:'annual'}];
                zongData = ['当月', '逐月累计', '全年'];
                var option = setOption(DataDiff,null,zongData,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }else {
                var option = setOption(DataDiff,null,zongData,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            }

        }


    })
}


function ModeMenu($JQuery) {
    var boxHeader =$JQuery(".boxHeader>div");
    boxHeader.on("click",function(e){
        $JQuery(this).addClass("activeBgColor").siblings().removeClass('activeBgColor');
        var index = $JQuery(this).index()+1;

			var data = getData();
				data.proId = "4500000707";
				console.log(data)
				var dataSourceX = httpRequestReload($JQuery,data,"proInvest");
				// console.log(dataSourceX)
				annualAc = dataSourceX.annualInvestAc;
				//当月 实际
				monthAc = dataSourceX.monthInvestAc;
				//今年 计划
				yearInvestPlan = dataSourceX.yearInvestPlan;
				//今年 实际
				yearInvestAc = dataSourceX.yearInvestAc;
				//全年 计划
				annualPlan = dataSourceX.annualInvestPlan;
				//当月 计划
				monthPlan =  dataSourceX.monthInvestPlan;
				
				var JHData = [{value:monthPlan,discern:'month'},{value:yearInvestPlan,discern:'accu'},{value:annualPlan,discern:'annual'}];
				var WCData = [{value:monthAc,discern:'month'},{value:yearInvestAc,discern:'accu'},{value:annualAc,discern:'annual'}];
	
		
		
        if(index == 1){
            ifDiffFlg = false;
			document.getElementById('myEchart').style="display:block";
			document.getElementById('myEchart2').style="display:none";
            // if(indexMyChartOption == 1){
                var option = setOption(JHData,WCData,zongData,legend);
                var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            // }else if(indexMyChartOption >= 2){
            //     var option = setOption(JHData1,WCData1,zongData1,legend);
            //     var myChart = initMyChartDom(document.getElementById('myEchart'),option);
            // }
        }else if(index == 2){
            ifDiffFlg = true;
			document.getElementById('myEchart').style="display:none";
			document.getElementById('myEchart2').style="display:block";
			
            // if(indexMyChartOption == 1){	
	             for (let i = 0; i < WCData.length; i++){
	                 var WCI = WCData[i];
	                 var JHI = JHData[i];
	                 var valueData = Number(parseFloat(WCI.value)-parseFloat(JHI.value)).toFixed(0);
	                 DataDiff[i] = {value:valueData,discern:WCI.discern}
	             }
				
				var  option = setOptionBox(DataDiff,zongData);
                var myChart = initMyChartDom(document.getElementById('myEchart2'),option);
            }
			// else if(indexMyChartOption >= 2){
			// 	var  WCData1 = [];
   //              for (let i = 0; i < WCData1.length; i++){
   //                  DataDiff1[i] = WCData1[i]-JHData1[i];
   //              }
          
			// 	var  option = setOptionBox(DataDiff1,zongData);
   //              var myChart = initMyChartDom(document.getElementById('myEchart2'),option);
   //          }
        // }
    })
}


























function initMyChartDom(JSDom,option) {
    var myChart = echarts.init(JSDom);
    myChart.setOption(option);
    return myChart;
}





function setOption(jhData,wcData,zongData,legend) {
	
    var	option = {
        color: ['#057EDD', '#FE841A'],
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            }
        },
        legend:[{
            itemWidth:12,
            itemHeight:12,
            top:0, //调整位置
            left:'35%' ,//调整位置
            textStyle: {color: '#fff',fontSize:'16'},
            data:[{name:'计划(万元)',icon:'roundRect'}],   //rect为矩形
        },{
            itemWidth:12,
            itemHeight:12,
            top:5, //调整位置
            right:'35%' ,//调整位置
            textStyle: {color: '#fff',fontSize:'16'},
            data:[{name:'完成(万元)',icon:'roundRect'}],   //rect为矩形
        }],
        grid: {
            left: '3%',
            right: '3%',
            bottom: '3%',
            containLabel: true
        },
        toolbox: {
            show: true,
            orient: 'vertical',
            left: 'right',
            top: 'center',
            feature: {
                mark: {show: true},
                dataView: {show: true, readOnly: false},
                magicType: {show: true, type: ['line', 'bar', 'stack', 'tiled']},
                restore: {show: true},
                saveAsImage: {show: true}
            }
        },
        xAxis: [
            {
                type: 'category',
                axisTick: {show: false},
                data:zongData,
                axisLabel: {  
				     interval: 0,  
					 formatter:function(value){
					   var res = value;
						  if(res.length > 2) {
							  res = res.substring(0, 1) + "..";
						  }
						  return res;
					 }
			     },  
                axisLine:{
                    lineStyle:{
                        color:"#6076AD",
                        width:1,
                    }
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: '#fff',
                        fontSize:'20'
                    }
                }
            }
        ],
        yAxis: [
            {
                type: 'value',
                splitLine: {
                    show: true,
                    lineStyle:{
                        color: '#244B8B',
                        width: 1,
                        type: 'solid'
                    }
                },
                axisLine:{
                    show:false,
                    lineStyle:{
                        color:"#6076AD",
                        width:1
                    }
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: '#fff',
                        fontSize:'20'
                    }
                }
            }
        ],
        series: [
            {
                name: '计划(万元)',
                type: 'bar',
                barGap: 0.2,
                label:{
                    show: true,
                    position: 'top',
                    color:'#fff',
                },
                data:jhData,
                barWidth: 30,
                itemStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            offset: 0,
                            color: "#3F28D0" // 0% 处的颜色
                        }, {
                            offset: 0.9,
                            color: "#0282DE" // 100% 处的颜色
                        }], false)
                    }
                },
            },
            {
                name: '完成(万元)',
                type: 'bar',
                label: {
                    show: true,
                    position: 'top',
                    color:'#fff'
                },
                data:wcData,
                barWidth: 30,
                itemStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                            offset: 0,
                            color: "#FE411B" // 0% 处的颜色
                        }, {
                            offset: 0.9,
                            color: "#FE9B1A" // 100% 处的颜色
                        }], false)
                    }
                },
            }
        ]
    };
    return option;
}




function setOptionBox(DataDiff,zongData) {
	
    var	option = {
   
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                type: 'shadow'
            }
        },
        legend:[],
        grid: {
            left: '3%',
            right: '3%',
            bottom: '3%',
            containLabel: true
        },
    
        xAxis: [
            {
                type: 'category',
                axisTick: {show: false},
                data:zongData,
                axisLine:{
                    lineStyle:{
                        color:"#6076AD",
                        width:1,
                    }
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: '#fff',
                        fontSize:'20'
                    }
                }
            }
        ],
        yAxis: [
            {
                splitLine: {
                    show: true,
                    lineStyle:{
                        color: '#244B8B',
                        width: 1,
                        type: 'solid'
                    }
                },
                axisLine:{
                    show:false,
                    lineStyle:{
                        color:"#6076AD",
                        width:1
                    }
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: '#fff',
                        fontSize:'20'
                    }
                }
            }
        ],
        series: [
            {
                type: 'bar',
                label: {
                    show: true,
                    position: 'top',
                    color:'#fff'
                },
                data:DataDiff,
                barWidth: 30,
                itemStyle: {
                    normal: {
                       color: new echarts.graphic.LinearGradient(0, 1, 0, 0, [{
                           offset: 0,
                           color: "#3F28D0" // 0% 处的颜色
                       }, {
                           offset: 0.9,
                           color: "#0282DE" // 100% 处的颜色
                       }], false)
                    }
                },
            }
        ]
    };
    return option;
}
